<template>
	<view class="fixed-action-bar">
		<view class="item" @click="leftClick">
			<view class="btn-box">
				<image :src="barType === '1' ? '/static/images/icon_edit.png' : '/static/images/icon_save.png' " mode="widthFix" class="icon"></image>
				
				<text class="text-edit">{{leftText}}</text>
			</view>
		</view>
		<view class="item" @click="rightClick">
			<view class="btn-box">
				<image :src="barType === '1' ? '/static/images/icon_del.png' : '/static/images/icon_back.png' " mode="widthFix" class="icon"></image>
				<text class="text-delete">{{rightText}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"mix-fixe-bar",
		data() {
			return {
				
			};
		},
		props:{
			barType:{
				type:String,
				default:"1",
			},
			leftText:{
				type:String,
				default:'编辑'
			},
			rightText:{
				type:String,
				default:'删除'
			},
			
		},
		methods:{
			leftClick(){
				this.$emit('leftEvent')
			},
			rightClick(){
				this.$emit('rightEvent')
			}
		}
	}
</script>

<style lang="scss" scoped>
.fixed-action-bar {
		
		width: 100%;
		display: flex;
		height: 70rpx;
		align-items: center;
		background: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 999;

		.item {
			width: 50%;
			display: flex;
			justify-content: center;
			align-items: center;

		}

		.icon {
			width: 30rpx;
		}

		.btn-box {
			width: 90rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 70rpx;
		}

		.text-edit {
			font-size: 24rpx;
			color: #0099cc;
			line-height: 70rpx;
		}

		.text-delete {
			font-size: 24rpx;
			color: #cc3357;
			line-height: 70rpx;
		}
	}
</style>
